<#define __IMAGE__="{{LAM.IMAGE}}" />
<#define __MYCOMMON__="{{LAM.MYCOMMON}}" />
<#define __PLUGINS__="{{LAM.PLUGINS}}" />
<#define __CLASSPATH__="{{LAM.classPath}}" />
<#define __COMMON__="{{LAM.COMMON}}" />
<#define __CSS__="{{LAM.CSS}}" />
<#define _LAYOUTS_="{{LAM.LAYOUTS}}" />
<#define __DATAPATH__="{{LAM.DATA}}" />
<#import path="/Tab.class,/Tools.class" root="__CLASSPATH__" write="1" befor="1" />
<#import type="css" path="/css/lib/bootstrap" root="__COMMON__" befor="1" />
<#import type="css" path="/global,/lib" root="__CSS__" befor="1" />

<#import type="css" path="/jquery.mCustomScrollbar/jquery.mCustomScrollbar.css" root="__PLUGINS__" befor="1" />
<#import path="/jquery.mCustomScrollbar/jquery.mCustomScrollbar.concat.min.js" root="__PLUGINS__" write="1" befor="1" />

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <meta name="keywords" content="{{title}}" />
    <meta name="description" content="{{title}}" />
    <!#HEAD/>
    <!#CSS/>
    <!#JS/>
    <#Block:begin type="override" id="title" data="{'title':'{{title}}'}">
    <title><%=title%></title>
    <#Block:end>
    <#=block id="title" data="{}" />

</head>

<body class="h-percent-of100">
<div id="hidden_bnt" class="sectionBtn-A2 sectionFixed-A1">
    <span class="mb3"></span>
    <span class="mb3"></span>
    <span></span>
</div>
<div class="container-fluid">
    <div class="row">
        <div class="col-md-2 sectionSidebar-A1">
            <#include tp-data="{'menu':{{menu}},'title':'喜鹊筑家旗舰店'}" file="_LAYOUTS_/default/include/inc_menu.html" />
        </div>
        <#=block id="content" />
    </div>
</div>
<script type="text/javascript">
    
    // 自定义滚动条
    LAM.mCustomScrollbar = function() {
        $('.mCustomScrollbar').mCustomScrollbar();
    };
    LAM.run([LAM,jQuery],function(LAM,$){
        'use strict';
        var System = this;
        System.use();


        var DATE={
            'b_width':0,
            'b_height':0,
            '$hidden_bnt':null
        };

        var setSize=function(n){
            n=n || 0;
            var height=$(window).height();
            var width=$(window).width();
            DATE.b_width=width;
            DATE.b_height=height;
            $('.sectionSidebar-A1').height(height);
            $('.sectionList-A2').height($(window).height()-116);


        };



        $(function(){

            
            LAM.mCustomScrollbar();



            $('.sectionList-A2 dd').on('click',function(){
                $(this).find('.sectionList-A1').toggle();
            });

            setSize();
            $(window).resize(function() {
                setSize();
            });
            $(window).scroll(function() {
                setSize($(window).scrollTop());
            });
            var $sectionWrapA4=$('.sectionWrap-A4');
            var $hidden_bnt=$('#hidden_bnt');

            $('#hidden_bnt').on('click',function(){
                if(!this.flag){
                    $sectionWrapA4.animate({"left":"47px"});
                    $hidden_bnt.animate({"left":"20px"});

                    this.flag = true;
                }else{

                    $sectionWrapA4.animate({"left":"220px"});
                    $hidden_bnt.animate({"left":"192px"});
                    this.flag = false;
                }


            });
        });



    });
</script>
<style type="text/css">
    .mCustomScrollbar{height: 500px;overflow: auto;}
    .mCSB_inside > .mCSB_container{margin:0;}
    .mCSB_scrollTools .mCSB_draggerContainer{left:17px;}
</style>
</body>
</html>
